
<html>
<head>
		<script src="${pageContext.request.contextPath}/Js/cargaCop/assets/js/jquery.knob.js"></script>

		<!-- jQuery File Upload Dependencies -->
		<script src="${pageContext.request.contextPath}/Js/cargaCop/assets/js/jquery.ui.widget.js"></script>
		<script src="${pageContext.request.contextPath}/Js/cargaCop/assets/js/jquery.iframe-transport.js"></script>
		<script src="${pageContext.request.contextPath}/Js/cargaCop/assets/js/jquery.fileupload.js"></script>
		
		<!-- Our main JS file -->
		<script src="${pageContext.request.contextPath}/Js/cargaCop/assets/js/script.js"></script>

<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/Js/cargaCop/assets/css/style.css" />

<style type="text/css">

#submitButton {
	background-color:#ffec64;
	-moz-border-radius:28px;
	-webkit-border-radius:28px;
	border-radius:28px;
	border:1px solid #ffaa22;
	display:inline-block;
	cursor:pointer;
	color:#333333;
	font-family:arial;
	font-size:17px;
	font-weight:bold;
	padding:16px 31px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffee66;
}
#submitButton:hover {
	background-color:#ffab23;
}
#submitButton:active {
	position:relative;
	top:1px;
}


#uploadedFile {
	background-color:#ffec64;
	-moz-border-radius:28px;
	-webkit-border-radius:28px;
	border-radius:28px;
	border:1px solid #ffaa22;
	display:inline-block;
	cursor:pointer;
	color:#333333;
	font-family:arial;
	font-size:17px;
	font-weight:bold;
	padding:16px 31px;
	text-decoration:none;
	text-shadow:0px 1px 0px #ffee66;
}

</style>


<script type="text/javascript">
$("#uploadFile").submit(function(e)
		{
//			 	var nameFile = document.getElementById("uploadedFile");
		    var formObj = $(this);//.serializeArray();
		    var formURL = formObj.attr("action");					 
		    var formData = new FormData(this);
		    alert($("#uploadedFile").val());
		    $.ajax({
		        url: formURL,
		    	type: 'POST',
		        data:  formData,
// 				data : {
// 					uplFileName : $("#uploadedFile").val(),
// 				},
		    	mimeType:"multipart/form-data",
		    	contentType: false,
		    	cache: false,
		    	processData:false,
		    	success: function(html)//function(data, textStatus, jqXHR)
		    	{
		    		$('#listFilesCop').html(html);
		    	},
		     	error: function(xhr, ajaxOptions, errorThrown)
		     	{
		    	 	alert('ups! ' + errorThrown);
		     	}         
		    });
		    e.preventDefault(); //Prevent Default action.
		    e.unbind();
		});
//			$("#upload").submit(); //Submit the form
</script>
</head>
<body>
<form id="uploadFile" method="post" action="guardaFilesCop" enctype="multipart/form-data"><!-- cambiar id por upload para trabajar con componente -->
	<input id="uploadedFile" type="file" name="upl" />
	<input id="submitButton" type="submit" value="Upload" />
<!-- 			<div id="drop"> -->
			
<!-- 				Drop Here -->

<!-- 				<a>Browse</a> -->
<!-- 				<input id="uploadedFile" type="file" name="upl" multiple /> -->
<!-- 			</div> -->

<!-- 			<ul> -->
				<!-- The file uploads will be shown here -->
<!-- 			</ul> -->

		</form>
		<br/>	
	
</body>
</html>